<script type="text/javascript" charset="utf-8">
  //This is a method that will be called on viewing this page it gets the data that will be added to the graph + what's the start
   //point and also what is the interval between each two points default will be 1 day also it takes the names of the things it
   //view across time by default for a story we will view no of shares , no of likes, no of dislikes and no of spams and no of comments
   //and then call method kl that will view the graph with the parameters already stated.
   
   //also this method gets the start date of data flow from get_interest_start_date method in interestshelper

  var $j = jQuery.noConflict();
  $j(document).ready(function() {
     //get The user's array of arrays of data
      data= <%= get_user_stat(@id) %>;
      //the graphs that we want to show
      names=["No Of Shares","No Of Likes","No of Dislikes","No of Spams","No of Comments"]; 
      //the time interval between one point and another in the graph.
      pointInterval= <%= 1.day * 1000 %>; 
      // Start point of the graph.
       x = <%= get_user_start_date(@id).to_i %>;
        if(x != -1) {
          x=x+1;
          pointStart= <%= get_user_start_date(@id).days.ago.to_i * 1000 %>;
         //Label for x-axis 
         xl="Day"; 
        //Label for y-axis
        yl="Number";
        //Label for graph title
        titleOfGraph="User Stat";
        //call the method that renders the graph with the calculated parameters.
         document.getElementById("deactivatedUser").style.display= "none"; 
        Graph(data,names,pointInterval,pointStart,xl,yl,titleOfGraph);
       } 
       else {
         document.getElementById("deactivatedUser").style.display = "block";
         document.getElementById("ccc").style.display = "none";
      }  
   });
</script>
<div class="row-fluid">
  <div class="sidebar-nav-fixed">
    <div class="well sidebar-nav">
            <ul class="nav nav-list">
          <li class="nav-header">Directory</li>
          <li class="divider"></li>   
          <li><a href="/users"><i class="icon-user"></i><font size="4%">Users</font></a></li>
          <li><a href="/interests/list"><i class="icon-heart"></i><font size="4%">Interest</font></a></li>
          <li><a href="/stories"><i class="icon-book"></i><font size="4%">Stories</font></a></li>
          <li class="divider"></li>
          <li class="active"><a href="/admins/statistics/all_users"><i class="icon-signal"></i><font size="4%">Statistics</font></a></li>
          <li><a href="/logs"><i class="icon-list"></i><font size="4%">Logs</font></a></li>
        </ul>
      </div>
    </div>
  <div class="main-user-profile-page">

    <div class="middle-user-profile-page-panel" >

        <!-- ccc is the id of the div that the graph would render to -->
        <div id="ccc" ></div>

          <div class="alert" id="deactivatedUser" style="display: none;">
  
           <h1><strong>Warning!</strong> User was deactivated before the last 30 days.</h1>

         </div>

         <div id="shared_stories" style="padding-top:30px; padding-left:30px;">

           <%if @user.get_shared_stories.empty?%>

             <div class="alert" id="noStoriesShared" >
  
               <h3><strong>Warning!</strong> No Stories Shared By This User.</h3>

             </div> 

         <%else%>  
            <ul class="nav nav-list">
              <li class="nav-header">
                Stories Shared By This User : 
              </li>
              <li class="divider" style="width:30%;">
              </li>
            </ul>

            <!-- to list all the stories -->
            <%@user.get_shared_stories.each do |story|%>
              <div class="well-story-component">
              <a href="/stories/<%= story.id%>"
               style="display:block; float:left; height:100px;">
               <%= image_tag "logo.jpeg", :class=>"img-story-component"%> 
              </a>
              <div style="padding-left:10px; margin-left:100px;">
                <h3>
                  <%= story.title %>
                </h3>
                <%= link_to "More Info",
                  {:controller => 'stories', :action => 'show',:id => story.id },
                   class: "interest-component-button-absolute btn btn-warning"%>
                <h5> Rank : <%= story.get_story_rank_all_time %> </h5>
                <h5> Shares : <%= story.shares.count %> </h5>
                <%= link_to "Statistics", 
                {:controller => 'statistics', :action => 'stories',:id => story.id }, 
                class: "interest-component-button-absolute btn btn-primary"%>
                <h5> Fetched at : <%=time_ago_in_words(story.created_at) +" ago." %> </h5>
                 <span class="greenbadge"  style="width:100%" ><%=story.interest.name %></span>
              </div>
            </div>
            <%end%>
        <%end%>
     </div>  
   </div>
  </div>  
</div>
